<!-- 用户抽屉 -->
<template>
  <div class="user-drawer">
    <Drawer :open.sync="$store.state.userDrawer.open" :docked="false">
      <List>
        <ListItem button>
          <ListItemTitle>个人资料</ListItemTitle>
        </ListItem>
        <ListItem button>
          <ListItemTitle>修改密码</ListItemTitle>
        </ListItem>
        <ListItem @click="loginOut" button>
          <ListItemTitle>退出登录</ListItemTitle>
        </ListItem>
      </List>
    </Drawer>
  </div>
</template>

<script lang="ts">
import {Component, Vue, Prop} from "vue-property-decorator";
import Drawer from "@/components/Drawer";
import { List, ListItem, ListItemTitle } from "@/components/List";
@Component({
  components: {
    Drawer,
    List,
    ListItem,
    ListItemTitle
  }
})
export default class UserDrawer extends Vue {

  loginOut () {
    this.$router.push({path: '/login'})
  }

}
</script>

<style lang="less">
</style>
